<!DOCTYPE html>
<head>
    <meta charset="utf-8">
	<meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,minimum-scale=1.0,user-scalable=no">
    <title>country </title>
    <script src="js/echarts.js"></script>
    <script src="js/jquery.js"></script>
	<script src="js/echarts-gl.js"></script>
	<script src="js/echarts-min-gl.js"></script>
</head>
<body>
    <div id="country" style="height:700px;width:100%;background-color:black;"></div>
	<div style="position:absolute;top:10px;left:10px;"><a href="world2.html">详细</a></div>
    <script type="text/javascript">      
			var  country  =  echarts.init(document.getElementById('country'));
              country_option = {
					globe: {
						environment: 'white',
						baseTexture: 'image/country.jpg',
						displacementScale: 0.05,
						displacementQuality: 'medium',
						shading: 'realistic',
						light: {
							ambient: {
								intensity: 0.5,
							},
							main: {
								intensity: 0.5,
								shadow: false,
							},
							ambientCubemap: {
								exposure: 0,
								diffuseIntensity: 0.02
							}
						},
						viewControl: {
							autoRotate: false
						}
					},
				};
                country.setOption(country_option);
    </script>
</body>